import { createElemet, createTextVNode as createTextNode } from "./vdom/create-element";

export function renderMixin(Vue) {
  // console.log('renderMixin');
  /**
   * _c(): 创建元素的虚拟 DOM
   * _v(): 创建文本的虚拟 DOM
   * _s(): 创建字符串，就是用户的一些变量
   */
  Vue.prototype._c = function () {
    // console.log('_c _c _c _c_c', arguments)
    return createElemet(this, ...arguments);
  }

  Vue.prototype._v = function (text) {
    // console.log('_v_v_v_v_v', arguments)
    return createTextNode(this, text);
  }

  Vue.prototype._s = function (value) { // 生成字符串即可
    if (value === null) return;
    // console.log('_s _s _s _s_s', arguments)
    return typeof value === 'object' ? JSON.stringify(value) : value;
  }


  // 调用 render 方法返回渲染出的虚拟 DOM 
  Vue.prototype._render = function () {
    const vm = this;
    const { render } = vm.$options;
    // 执行 render 函数，把数据和元素绑定到一起，为了后面的页面挂载元素准备
    const vnode = render.call(vm); // render 函数返回生成虚拟 DOM
    // 返回虚拟 DOM
    return vnode;
  }
}